<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="/css/css.css" rel="stylesheet" type="text/css" />
<link href="/css/common.css" rel="stylesheet" tyle="text/css" />
<script src="/js/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="/js/jquery.SuperSlide.2.1.1.js" type="text/javascript"></script>
<script src="/js/common_js.js" type="text/javascript"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<title>用户注册.</title>
    <script>
        $(function (){
            new Vue({
                el:"#app",
                data:{
                    account:"",
                    password:"",
                    password2:"",
                    email:"",
                    code:"",
                    agree:""

                },
                methods:{
                    registered:function(){
                        /*alert(this.account+"....."+this.password
                            +"....."+this.password2+"....."+this.email
                            +"....."+this.code
                            +"....."+this.agree)*/
                        if(!(/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/.test(this.password))){
                            alert("密码要6-16位数字和字母的组合！")
                            location.href = "/front/user/registered";
                        }else if(this.password != this.password2){
                            alert("两次密码输入不相同！")
                            location.href = "/front/user/registered";
                        }else if (!(/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(this.email))){
                            alert("邮箱格式错误！")
                            location.href = "/front/user/registered";}
                        else if(!(this.agree)){
                            alert("请勾选同意协议再注册！")
                            location.href = "/front/user/registered";
                        }else {
                            axios.post("/front/user/registered",{
                                account: this.account,
                                password: this.password,
                                email: this.email,
                                code: this.code
                            }).then(r=>{
                                 //alert(r.data)
                                if(r.data.code == 200){
                                    alert("注册成功!!!")
                                    location.href = "/front/user/login";
                                }if(r.data.code == 400){
                                    alert("该用户名已存在")
                                    location.href = "/front/user/registered";
                                }if(r.data.code == 401){
                                    alert("该邮箱已存在")
                                    location.href = "/front/user/registered";
                                }
                            })
                        }

                    }
                }
            })


        })
    </script>
</head>

<body>
<!--顶部样式-->
<div class="common_top">
 <div class="Narrow">
  <div class=" left logo"><a href="#"><img th:src="@{/images/logo1.png}" alt="logo" height="139" width="247"/></a></div>
  <!--电话图层-->
  <div class="phone"><label>全国服务热线：</label><em>400-345-5633</em></div>
 </div>
</div>
<!--用户注册样式-->
<div class="registered_style Narrow clearfix">
   <div class="left_advertising">
    <img img th:src="@{/images/login1.jpg}" height="675" width="1000" />
   </div>
   <div class="right_register">
     <div class="register_Switching" id="register_Switching">
       <div class="hd">
        <li>用户注册</li></ul>
       </div>
       <div class="bd" id="app">
        <ul>
	   <div class="form clearfix">
	    <div class="item"><label class="rgister-label">用&nbsp;&nbsp;户&nbsp;&nbsp;名：</label><input name="account" v-model="account" type="text"  class="text" /><b>*</b></div>
		<div class="item"><label class="rgister-label" >密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码：</label><input name="password" v-model="password" type="password"  class="text" p/><b>*</b></div>
		<div class="item"><label class="rgister-label " >确认密码：</label><input name="password2" v-model="password2" type="password"  class="text" /><b>*</b></div>
	    <div class="item"><label class="rgister-label" >电子邮箱：</label><input name="email" v-model="email" type="text"  class="text" /><b>*</b></div>

           <div class="item "><label  class="rgister-label ">验&nbsp;证&nbsp;码：</label><input name="code" v-model="code" type="text"  class="Recommend_text" /></div>
		<div class="item-ifo">
                    <input type="checkbox" class="checkbox left"  name="agree" value="y" v-model="agree">
                    <label for="protocol" class="left">我已阅读并同意<a href="#" class="blue" id="protocol">《IntellHome用户注册协议》</a></label>
                </div>
	  </div>	
	  <div class="rgister-btn">
	  <a href="javascript:void(0)" class="btn_rgister" @click="registered" >注&nbsp;&nbsp;&nbsp;&nbsp;册</a>
	  </div>
	  <div class="Note"><span class="login_link">已是会员<a href="/front/user/login">请登录</a></span></div>
        </ul>
   </form>
 </div>
     </div>
     <script>jQuery(".register_Switching").slide({trigger:"click"});</script>
    </div>
</div>
<!--底部样式-->
 <div class="bottom_footer">
   <p><a href="#">关于我们</a> | <a href="#">联系我们</a> | <a href="#">商家入驻</a> | <a href="#">法律申明</a> | <a href="#">友情链接</a>  </p>
	 <p>Copyright©2014四川金祥保险销售有限公司.All Rights Reserved. </p>
	 <p>川ICP备09150084号</p>
   </div>
</body>
</html>
